<template>
  <div ref="aaa">
    {{ result }}
    <el-button @click="ceshi">测试</el-button>
    <div v-if="result.notitle">
      <!-- v-html="item.innerText.replace(/himmpat\-src/g, 'src')" -->

      <p
        v-for="(item, index) in result.notitle"
        :key="index"
        v-html="
          item.innerText
            ? item.innerText.replace(/himmpat\-src/g, 'src')
            : item.innerText
        "
      ></p>
    </div>
  </div>
</template>

<script>
import {
  obj,
  onlyP,
  titleIncludesTitle,
  bigTitleHeading,
  heading1,
  contentNotP,
  pro,
  aa,
  hasTitle,
  titleP,
  titleEp,
} from "./ce.js";
import { a1, a2, ceshi1, ceshi2, aaa  , cn} from "./ce1.js";
export default {
  data() {
    return {
      result: {},
      titleMap: {
        // inventiontitle: ["invention-title", "inventiontitle"],//标题不用处理
        technicalfield: [
          "technicalfield",
          "summary-of-invention",
          "technical-field",
          "industrial-applicability",
        ],
        backgroundart: ["backgroundart", "background-art"],
        disclosure: ["disclosure", "summary-of-invention"],
        drawingsdescription: [
          "drawingsdescription",
          "description-of-drawings",
          "reference-signs-list",
        ],
        inventionmode: [
          "inventionmode",
          "mode-for-invention",
          "description-of-embodiments",
          "best-mode",
        ],
      },
      titleNameMap: {
        technicalfield: {
          name: "技术领域",
          class: "ceshi1",
        },
        backgroundart: {
          name: "背景技术",
          class: "ceshi2",
        },
        disclosure: {
          name: "发明内容",
          class: "ceshi3",
        },
        drawingsdescription: {
          name: "附图说明",
          class: "ceshi4",
        },
        inventionmode: {
          name: "实施例",
          class: "ceshi5",
        },
      },
      arr: [
        "technicalfield",
        "summary-of-invention",
        "technical-field",
        "industrial-applicability",
        "technical-field",
        "backgroundart",
        "background-art",
        "disclosure",
        "summary-of-invention",
        "drawingsdescription",
        "description-of-drawings",
        "reference-signs-list",
        "inventionmode",
        "mode-for-invention",
        "description-of-embodiments",
        "best-mode",
      ],
      titleAllMap: {
        technicalfield: [
          "技术领域",
          "一技术领域",
          "TECHNICAL FIELD",
          "industrial-applicability",
        ],
        backgroundart: [
          "背景技术",
          "二背景技术",
          "BACKGROUND",
          "BACKGROUND TECHNOLOGY",
          "BACKGROUND TECHNIQUE",
        ],
        disclosure: [
          "三发明内容",
          "发明内容",
          "三实用新型内容",
          "实用新型内容",
          "THE CONTENT OF THE INVENTION",
          "SUMMARY OF THE INVENTION",
          "UTILITY MODEL CONTENT",
          "DISCLOSURE OF INVENTION",
        ],
        drawingsdescription: [
          "四说明书附图说明",
          "四说明书附图概述",
          "四附图说明附图1附图2",
          "四附图说明图1图2",
          "四附图说明图1图2图3图4图5",
          "附图说明",
          "附图概述",
          "DESCRIPTION OF THE DRAWINGS",
          "DESCRIPTION OF DRAWINGS",
          "DRAWINGS",
          "ACCOMPANYING DRAWING EXPLANATION",
          "BRIEF DESCRIPTION OF THE DRAWINGS",
        ],
        inventionmode: [
          "实施例",
          "五实施例",
          "五具体实施例",
          "五具体实施方式",
          "四实施例",
          "四具体实施例",
          "四具体实施方",
          "具体实施例",
          "具体实施方式",
          "SPECIFIC EMBODIMENT",
          "EMBODIMENT",
          "THE SPECIFIC EMBODIMENT",
          "THE UTILITY MODEL CONTENT",
          "DETAILED DESCRIPTION",
          "DETAILED DESCRIPTION OF THE INVENTION",
          "DETAILED DESCRIPTION OF EMBODIMENT (S) OF INVENTION",
        ],
      },
      title: [
        "技术领域",
        "一技术领域",
        "背景技术",
        "二背景技术",
        "三发明内容",
        "三实用新型内容",
        "四附图说明",
        "四附图概述",
        "四说明书附图说明",
        "四说明书附图概述",
        "四附图说明附图1附图2",
        "四附图说明图1图2",
        "四附图说明图1图2图3图4图5",
        "发明内容",
        "附图说明",
        "实施例",
        "五实施例",
        "五具体实施例",
        "五具体实施方式",
        "四实施例",
        "四具体实施例",
        "四具体实施方",
        "附图概述",
        "具体实施例",
        "具体实施方式",
        "[技术领域]",
        "[背景技术]",
        "[发明内容]",
        "[附图说明]",
        "[具体实施例]",
        "[具体实施方式]",
        "实用新型内容",
        "TECHNICAL FIELD",
        "BACKGROUND",
        "BACKGROUND TECHNOLOGY",
        "BACKGROUND TECHNIQUE",
        "THE CONTENT OF THE INVENTION",
        "SUMMARY OF THE INVENTION",
        "DESCRIPTION OF THE DRAWINGS",
        "DESCRIPTION OF DRAWINGS",
        "DRAWINGS",
        "UTILITY MODEL CONTENT",
        "SPECIFIC EMBODIMENT",
        "EMBODIMENT",
        "THE SPECIFIC EMBODIMENT",
        "THE UTILITY MODEL CONTENT",
        "ACCOMPANYING DRAWING EXPLANATION",
        "DETAILED DESCRIPTION",
        "DETAILED DESCRIPTION OF THE INVENTION",
        "DISCLOSURE OF INVENTION",
        "DETAILED DESCRIPTION OF EMBODIMENT (S) OF INVENTION",
        "BRIEF DESCRIPTION OF THE DRAWINGS",
      ],
    };
  },

  mounted() {
    this.init();
  },
  methods: {
    init() {
      let dom = document.createElement("div");
      let valueStr = cn.instrPath
        .replace(/<!\[CDATA\[/g, "")
        .replace(/]]>/g, "")
        .replace(/&amp;/g, "&")
        .replace(/alt=".*?"/g, "")
        .replace(/<p([^>]+)\/>/g, "<p$1></p>")
        .replace(/\<p>/g, "<pa>")
        .replace(/\<p\s/g, "<pa ")
        .replace(/\<\/p>/g, "</pa>")
        .replace(/\<paragraph>/g, "<pa>")
        .replace(/\<paragraph\s/g, "<pa ")
        .replace(/\<\/paragraph>/g, "</pa>")
        .replace(/\<Paragraph>/g, "<pa>")
        .replace(/\<Paragraph\s/g, "<pa ")
        .replace(/\<\/Paragraph>/g, "</pa>")
        .replace(/\<tables/g, "<div")
        .replace(/\<\/tables/g, "</div")
        .replace(/\<TableFormula|\<table/g, "<table border='1'")
        .replace(/\<\/TableFormula|\<\/table/g, "</table")
        .replace(/\<Row|\<row/g, "<tr")
        .replace(/\<\/Row|\<\/row/g, "</tr")
        .replace(/\<entry/g, "<td")
        .replace(/\<\/entry/g, "</td");
      console.log(valueStr, "valueStr");
// return
      dom.innerHTML = valueStr;
      dom = dom.getElementsByTagName("description")[0];
      document.body.appendChild(dom);
      return 
      // this.$refs.aaa.appendChild(dom);
      // console.dir(dom, "dom");
      //如果没有大标题没有heading的情况
      let flag = false;
      for (let i = 0; i < this.arr.length; i++) {
        if (dom.getElementsByTagName(this.arr[i]).length > 0) {
          flag = true;
          break;
        }
      }
      let heading = dom.getElementsByTagName("heading");

      //没有标志性内容做标题, 直接显示
      if (!flag && heading.length == 0) {
        this.handle1(dom);
        return;
      }
      //有大标题的话处理大标题 大标题处理
      if (flag) {
        //处理大标题 , title没处理
        this.bigTitleHandle(dom);
        //删除大标题用 把内容直接替换大标题
      }
      // 处理heading;
      // if (heading.length > 0) {
      //   this.handleHeading(dom);
      // }

      this.handleP(dom);
      console.dir(dom);
      // return;
      //切割heading 处理成两个heading之间的dom属于上一个heading
      this.cutHeading(dom);
      //得到附图说明的内容
      let text = "";

      //处理InventionTitle标题

      // //合成
      // let ceshi = {
      //   notitle: dom.childNodes,
      // };
      // this.result = ceshi;
    },

    //规则一
    handle1(dom) {
      //有可能会有标题,也要展示
      let hasTitle = false;
      let arr = ["invention-title", "inventiontitle"];
      let pa = document.createElement("pa");
      arr.forEach((item) => {
        let list = dom.getElementsByTagName(item);
        if (list.length > 0) {
          hasTitle = true;
          for (let i = 0; i < list.length; i++) {
            if (list[i].innerText.trim()) {
              pa.innerText += list[i].innerText.trim() + " ";
            }
          }
        }
      });
      //这个只用来标号,不进行搜索
      this.handleP(dom, "rule1");
      if (hasTitle) {
        dom.insertBefore(pa, dom.firstChild);
      }

      // let ceshi = {
      //   notitle: this.getHtml(dom, "notitle", "pa"),
      // };
      // ceshi.notitle = ceshi.notitle.querySelectorAll("pa");
      // this.result = ceshi;
    },
    //处理全文的pa标签
    //1 p标签如果是空的话 看自己的上面是否有内容,如果有的话,归于上一个标签中,然后删除当前空的pa标签
    //2 pa标签如果有内容的话,看内容是否是标题的内容,如果是的话,就把当前的p标签变成heading标签,然后把内容放到heading标签中
    //3 pa标签如果有内容的话,看内容是否是标题的内容,如果不是的话,就直接把内容放到p标签中
    handleP(dom, mark) {
      console.log(dom, "dom");
      let pList = dom.getElementsByTagName("pa");
      // console.log(pList, "pList");
      for (let i = 0; i < pList.length; i++) {
        let currentP = pList[i];
        //规则一
        if (mark) {
          if (!currentP.innerText.trim()) {
            const range = document.createRange();
            let startNode = pList[i - 1];
            let endNode = currentP;
            range.setStartAfter(startNode);
            range.setEndBefore(endNode);
            //两段之间的dom
            let fragment = range.extractContents();
            pList[i - 1].append(fragment);
            currentP.remove();
            i--;
          }
        } else {
          if (!currentP.innerText.trim()) {
            const range = document.createRange();
            let startNode = pList[i - 1];
            let endNode = currentP;
            range.setStartAfter(startNode);
            range.setEndBefore(endNode);
            //两段之间的dom
            let fragment = range.extractContents();
            pList[i - 1].append(fragment);
            currentP.remove();
            i--;
          }
          //如果 p的内容是标题就换成heading 并且加上class
          else {
            let content = currentP.innerText
              .toUpperCase()
              .trim()
              .replace(/[,./;?!()\[\]\【\】,。,、;:：'""《》()\[\],]+/g, "");

            if (this.title.includes(content)) {
              console.log(currentP.getAttribute("number"));
              let pa = document.createElement("heading");
              //给第一个命中的大标题添加上对应的class
              Object.keys(this.titleAllMap).forEach((key) => {
                if (this.titleAllMap[key].includes(content)) {
                  if (!dom.querySelector(this.titleNameMap[key].class)) {
                    pa.classList.add(this.titleNameMap[key].class);
                  }
                }
              });
              pa.innerText = `${pa.className}-wei${currentP.innerHTML}`;
              currentP.parentNode.replaceChild(pa, currentP);
              i--;
            }
          }
        }
      }
      let currentNum = 0;
      // 该删的已经删了,现在进行排序
      for (let i = 0; i < pList.length; i++) {
        let number, num;
        if (pList[i].getAttribute("number")) {
          number = pList[i].getAttribute("number");
        }
        if (pList[i].getAttribute("num")) {
          num = pList[i].getAttribute("num");
        }
        if (num) {
          currentNum = num.match(/[0-9]+/g)[0];
        } else if (number) {
          currentNum = number.match(/[0-9]+/g)[0];
        } else {
          currentNum = parseInt(currentNum) + 1;
        }
        let endNum = Number(currentNum).toString().padStart(4, 0);
        pList[i].classList.add("paragraph");

        pList[
          i
        ].innerText = `<span class='innumber'>[${endNum}]</span>${pList[i].innerHTML}`;
      }
    },
    //处理大标题
    bigTitleHandle(dom) {
      //所有有大标题的内容 都把大标题中的内容都抠出来放在dom中,然后如果第一条信息就是标题的话把标题变成heading标签 , 其他的还是p标签
      for (let key in this.titleMap) {
        this.titleMap[key].forEach((item) => {
          let currentDom = dom.getElementsByTagName(item); //找到存在的dom
          if (currentDom.length > 0) {
            //dom是一个dom收集器,同一个标题可能会有多个
            for (let i = 0; i < currentDom.length; i++) {
              //如果有子级,并且第一个子级是标题的内容的话,把这个标题转成heading标签包裹
              //内容不是空的话
              if (currentDom[i].innerText.trim()) {
                let p = currentDom[i].querySelector("pa");
                //如果大标题第一个内容是对应的标题名称的话,就处理成heading标签
                if (p) {
                  let content = p.innerText
                    .toUpperCase()
                    .trim()
                    .replace(
                      /[,./;?!()\[\]\【\】,。,、;:：'""《》()\[\],]+/g,
                      ""
                    );
                  console.log(content, "con");
                  if (this.title.includes(content)) {
                    //包括的话就不用处理 , 已经是对应标签了
                    // let pa = document.createElement("pa");
                    // pa.innerHTML = p.innerHTML;
                    // currentDom[i].replaceChild(pa, p);
                    // //把内容跑抛出来
                    // this.getDom(currentDom[i]);
                    // i--;
                  }
                  //如果大标题的第一个内容不是对应的小标题的内容的话要自己整一个标题
                  else {
                    let pa = document.createElement("pa");
                    pa.innerHTML = this.titleNameMap[key].name;
                    let firstChild = currentDom[i].firstChild;
                    currentDom[i].insertBefore(pa, firstChild);
                    //把内容跑抛出来
                    this.getDom(currentDom[i]);
                    i--;
                  }
                }
              }
              // 内容如果是空的话可以删了
              else {
                currentDom[i].remove();
                i--;
              }
            }
          }
        });
      }
      //大标题处理完毕
      console.log(dom);
    },
    //得到一个dom中的内容,
    getDom(dom) {
      const fragment = document.createDocumentFragment();
      while (dom.firstChild) {
        fragment.appendChild(dom.firstChild);
      }
      // 将文档片段插入到父级元素中
      dom.parentNode.insertBefore(fragment, dom);
      dom.remove();
    },
    //得到对应标题的dom
    getHtml(dom, key, className) {
      const div = document.createElement(key);
      const list = dom.getElementsByTagName(className);
      console.log(list, "111");
      if (list.length > 0) {
        for (let i = 0; i < list.length; i++) {
          //查看内容是否为空
          if (list[i].innerText.toUpperCase().trim()) {
            //克隆节点
            let cloneNode = list[i].cloneNode(true);
            div.appendChild(cloneNode);
          }
        }
        if (div.innerText == "") {
          return null;
        } else {
          console.log(div, "dov");
          return div;
        }
      }
    },

    // 处理全文heading 把所有的heading
    handleHeading(dom) {
      let heading = dom.getElementsByTagName("heading");
      if (heading.length > 0) {
        for (let i = 0; i < heading.length; i++) {
          const element = heading[i];
          if (element.innerText.trim()) {
            let content = element.innerText
              .toUpperCase()
              .trim()
              .replace(/[,./;?!()\[\]\【\】,。,、;:：'""《》()\[\],]+/g, "");
            if (this.title.includes(content)) {
              let pa = document.createElement("pa");
              //给第一个命中的大标题添加上对应的class
              Object.keys(this.titleAllMap).forEach((key) => {
                if (this.titleAllMap[key].includes(content)) {
                  if (
                    dom.getElementsByClassName(this.titleNameMap[key].class)
                      .length == 0
                  ) {
                    pa.classList.add(this.titleNameMap[key].class);
                  }
                }
              });
              pa.innerHTML = element.innerHTML;
              element.parentNode.replaceChild(pa, element);
              element.remove();
              i--;
            }
          }
        }
      }
    },
    cutHeading(dom) {
      let hasTitle = false;
      let arr = ["invention-title", "inventiontitle"];
      let pa = document.createElement("pa");
      arr.forEach((item) => {
        let list = dom.getElementsByTagName(item);
        console.log(list);
        if (list.length > 0) {
          console.log(list);
          hasTitle = true;
          for (let i = 0; i < list.length; i++) {
            if (list[i].innerText.trim()) {
              pa.innerText += list[i].innerText.trim() + " ";
            }
          }
        }
      });
      const range = document.createRange();
      let map = new Map();
      let heading = dom.getElementsByTagName("heading");

      //如果有标题创建一个heading在前面
      if (hasTitle) {
        let heading = document.createElement("heading");
        heading.innerText = "";
        dom.insertBefore(pa, dom.firstChild);
        dom.insertBefore(heading, dom.firstChild);
      }
      //到了最后一个heading还剩下最后一个heading的内容
      for (let i = 0; i < heading.length; i++) {
        let endNode = heading[i];
        let startNode = heading[i - 1];
        if (hasTitle && !startNode) {
          continue;
        } else if (!startNode) {
          let first = document.createElement("first");
          dom.insertBefore(first, dom.firstChild);
          startNode = first;
        }
        range.setStartAfter(startNode);
        range.setEndBefore(endNode);
        let fragment = range.extractContents();
        let name = startNode.innerText.trim();
        while (map.has(name)) {
          name += " ";
        }
        map.set(name, fragment);
      }
      let end = document.createElement("end");
      dom.append(end);
      console.log(heading);
      let startNode = heading[heading.length - 1];
      console.log(startNode);
      let endNode = end;
      if (startNode) {
        range.setStartAfter(startNode);
        range.setEndBefore(endNode);
        let fragment = range.extractContents();
        let name = startNode.innerText.trim();
        while (map.has(name)) {
          name += " ";
        }
        map.set(name, fragment);
      }

      console.log(map, ";111111");
      let text = "";
      for (let [key, value] of map) {
        if (
          key.trim().indexOf("-wei") != -1 &&
          this.titleAllMap.drawingsdescription.includes(
            key.trim().split("-wei")[1]
          )
        ) {
          let list = value.querySelectorAll("pa");
          console.log(list);
          for (let i = 0; i < list.length; i++) {
            text += list[i].innerText;
            0;
          }
        }
      }
      console.log(text, "111");
    },
  },
};
</script>

<style></style>
